<template>
  <div id="nav">
    <router-link to="/musicIndex"
      ><i class="iconfont icon-yinle"></i><span>音乐</span></router-link
    >
    <router-link to="/articleIndex"
      ><i class="iconfont icon-fabuwenzhang"></i><span>文章</span></router-link
    >
    <router-link to="/movieIndex"
      ><i class="iconfont icon-dianying"></i><span>电影</span></router-link
    >
  </div>
</template>

<script>
export default {};
</script>

<style sco[ed>
#nav {
  box-sizing: border-box;
  display: flex;
  height: 1.0667rem;
  line-height: 1.0667rem;
  /* border: 1px solid #333; */
  background-color: #f5f5f5;
  justify-content: space-around;
  align-items: center;
  position: fixed;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 750px;
}
#nav i {
  font-size: 0.4rem;
}
span {
  font-size: 0.4rem !important;
}
</style>